import React, { Component } from 'react';
import { connect } from 'dva';
import { Form, Icon, Input, Button, Row, Col, Card, Select } from 'antd';

const { Option } = Select;
function hasErrors(fieldsError) {
  return Object.keys(fieldsError).some(field => fieldsError[field]);
}

class Welcome extends Component {
  state = {
    modalVisible: false,
  };

  componentDidMount() {
    this.props.dispatch({
      type: 'welcome/getWelcome',
    });
  }

  handleSubmit = e => {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {
      if (!err) {
        console.log('Received values of form: ', values);
        this.props.dispatch({
          type: 'welcome/setWelcome',
          payload: values,
        });
      } else {
        console.log('出错信息---', err);
      }
    });
  };

  render() {
    const { getFieldDecorator, getFieldsError, getFieldError, isFieldTouched } = this.props.form;

    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 14 },
      },
    };

    const tailFormItemLayout = {
      wrapperCol: {
        xs: {
          span: 24,
          offset: 0,
        },
        sm: {
          span: 14,
          offset: 6,
        },
      },
    };

    return (
      <Card style={{ border: 'none' }}>
        <Row>
          <Form onSubmit={this.handleSubmit}>
            <Form.Item {...formItemLayout} label="欢迎语：">
              {getFieldDecorator('welcome_message', {
                // rules: [{ required: true, message: '请输入欢迎语!' }],
              })(<Input placeholder="欢迎语" />)}
            </Form.Item>

            <Form.Item {...tailFormItemLayout}>
              <Button style={{ marginRight: '8px' }} type="primary" htmlType="submit">
                保存
              </Button>
            </Form.Item>
          </Form>
        </Row>
      </Card>
    );
  }
}

const mapStateToProps = state => ({
  msg: state.welcome.msg,
});
export default connect()(Form.create({ name: 'Welcome' })(Welcome));
